<!DOCTYPE html>
<html xmlns:th="http://www.springframework.org/schema/data/jaxb">
<head>
    <meta charset="utf-8">
    <title>文本转符号</title>
    <link rel="icon" href="../../pic/icon/xijia.png" type="image/x-icon">  <!--在网页标题左侧显示图标-->
    <link rel="shortcut icon" href="../../pic/icon/xijia.png" type="image/x-icon"> <!-- 在收藏夹显示图标-->
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/components/layuiadmin/layui/src/css/layui.css" media="all">
    <link rel="stylesheet" href="/components/layuiadmin/style/admin.css" media="all">
    <link rel="stylesheet" href="/base/css/search.css" media="all">
    <script src="/components/layuiadmin/layui/src/layui.js"></script>
    <script src='/base/js/jquery-3.4.1.min.js'></script>
    <script src="/base/js/app.js"></script>
</head>
<body>
<!-- 搜索 -->
<div class="searchTable">
    符号：
    <div class="layui-inline">
        <input id="fill" class="layui-input" style="width: 100px" value="#" autocomplete="off"
               onkeyup="inputMonitor()">
    </div>
    内容：
    <div class="layui-inline">
        <input id="content" class="layui-input" style="width: 240px" placeholder="请输入内容" autocomplete="off"
               onkeyup="inputMonitor()">
    </div>
    <span style="margin-left: 6%">
         当前缩放大小:<font id="narrow" size="3">4</font>
        <button style="margin-left: 1%" class="layui-btn layui-btn-normal layui-btn-sm" onclick="plus1()">变大</button>
        <button class="layui-btn layui-btn-normal layui-btn-sm" onclick="minus1()">变小</button>
        作者QQ: 1720696548
    </span>
    <pre> <div id="resultContent" style="margin-top:1%;background:#f9f9f9; color:#ff9e50;width: 500%;height: 800px;"></div></pre>
    <!--        展示区-->
    <!--    </div>-->
    <!--    <div style="margin-top:1%;" class="layui-form-item layui-form-text">-->
    <!--        <label class="layui-form-label">展示区</label>-->
    <!--        <div class="layui-input-block">-->
    <!--            <textarea id="resultContent"  style="height: 600px" class="layui-textarea"></textarea>-->
    <!--        </div>-->
    <!--    </div>-->

    <!--
        <textarea id="resultContent" style="height:600px;margin-top:1%;background:#e5e8ff; color:#ff9e50;white-space: pre" placeholder="请输入内容" class="layui-textarea"></textarea>
    -->

</div>
<script>
    $(function () {
        $("#content").val("作者: 兮家小二");
        inputMonitor();
    });

    // 装换接口
    let convert = path + "/admin/xj/tool/fhConvert";

    //字体缩放大小
    let narrow = 4;

    function inputMonitor() {
        let param = "";
        param += "?content=" + $("#content").val();
        param += "&narrow=" + narrow;
        let fill = $("#fill").val();
        param += "&fill=" + encodeURIComponent(fill);
        let result = Ajax.get(convert + param);
        $("#resultContent").html(result.data);
    }

    // 字体缩放大小+1
    function plus1() {
        if (narrow <= 1) {
            alert("不能再变大了");
            throw new Error();
        }
        narrow -= 1;
        $("#narrow").html(narrow);
        inputMonitor();
    }

    // 字体缩放大小-1
    function minus1() {
        if (narrow >= 10) {
            alert("不能再变小了");
            throw new Error();
        }
        narrow += 1;
        $("#narrow").html(narrow);
        inputMonitor();
    }


    // 替换特殊符号
    function replaceScript(s) {
        var aStr = new Array(); //定义一个数组
        aStr = s.split("");     //将传入的字符串切割成字符串数组
        var pattern = new RegExp("[~'!@#$%^&*()-+_=:]", "g");    //将要匹配的特殊字符
        var result = "";    //定义一个空字符串，作为返回值
        for (var i = 0; i < s.length; i++) {
            if (pattern.test(s[i]))  //RegExp.test()检索字符串中指定的值。返回 true 或 false。
            {
                s[i] = s[i].toString(16);     //将特殊字符转换成16进制数
            }
            ;
            result += s[i];
        }
        return result;
    }
</script>
</body>
</html>